<!doctype html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <link rel="stylesheet" href="../res/css/weui.css"/>
    <link rel="stylesheet" href="../res/css/weuix.css"/>
    <link rel="stylesheet" href="../res/css/common.css"/>
    <script src="../res/js/zepto.min.js"></script>
    <script src="../res/js/zepto.weui.js"></script> 
    <script src="../res/js/common.js?v=2"></script>
	<style>
		#code{display: contents;}
		.cd{
			touch-action: none; 
			width: 104px;
			height: 30px;
			border-radius: 30px;
			border: 1px solid #fc761f;
			color: #fc761f;
			background: #ffffff;
			float: right;
			margin-top: 10px;
		}
		.cd_pic{
			float: right;
			width: 104px;
			height: 40px;
			margin-top: 5px;
		}
		.disappear{display: none;}
		.weui-cell {
			display: block;
			position: relative;
			padding: 10px 15px;
			top: -60px;
		}
		.weui-btn_primary {
		    background-color: #1189ff;
		}
		.weui-header .weui-header-title{
			color: #FFFFFF;
		}
		.weui-btn_primary:not(.weui-btn_disabled):active {
		    color: rgba(255, 255, 255, 0.6);
		    background-color: #1189ff;
		}
		.weui-cell__bd{
			height: 50px;
			line-height: 50px;
			border-bottom: 1px solid #E0E0E0;
			position: relative;
		}
		.placeholder{
			background-image: url('https://yixiang-hospital.oss-cn-shenzhen.aliyuncs.com/mini/minImg/img_bg.png');
			background-size: 100% 100%;
			background-repeat: no-repeat;
			display: flex;
		}
		.placeholder img:first-child{
			margin:0 auto;
			width: 40%;
			height: 30%;
			margin-top: 60px;
		}
		.placeholder img:last-child{
			margin:0 auto;
			width: 50%;
			height: 75%;
			margin-top: 25px;
		}
		.left_img{
			width: 20px;
			height: 18px;
			display: inline-block;
			vertical-align: middle;
			z-index: 1;
		}
		.weui-input {
		    padding-left: 10px;
		    width: 80%;
		}

		.flex-row{
			display: flex;
			align-items: center;
		}
		.weui-btn.get-code{
			width: unset;
			flex-grow: 0;
			font-size: 16px;
			line-height: 36px;
			margin-right: 0;
			color: #fff;
		}
		.notClickn {
			pointer-events: none;
			opacity: 0.5;
		}
		.cell-agree{
			margin-top: 10px;
			font-size: 14px;
		}
		.togglePsw{
			width: 21px;
			height: 16px;
			display: none;
			position: absolute;
			right: 10px;
			top: 50%;
			transform: translateY(-50%);
		}
		.togglePsw.eye-open{
			height: 27px;
		}
	</style>
</head>

<body ontouchstart>
	<div class="fixed-top">
		<div class="weui-header weui-btn_primary"> 
			<div class="weui-header-left"><a id="btnBack" onclick="goPage('login.htm');" class="icon icon-109 f-white"></a></div>
			<div class="weui-header-title">忘记密码</div>
			<div class="weui-header-right"></div>
		</div>
	</div>
	<div class="weui-cells weui-cells_form" style="margin-top:0px;">
		<div class="weui-flex">
			<div class="weui-flex__item">
				<div class="placeholder">
					<img src="https://yixiang-hospital.oss-cn-shenzhen.aliyuncs.com/mini/minImg/img_hello@3x.png" class="img-max" >
					<img src="https://yixiang-hospital.oss-cn-shenzhen.aliyuncs.com/mini/minImg/img_doctor.png" class="img-max">
				</div>
			</div>
		</div>
		<div class="weui-cell">
			<div class="weui-cell__bd">
				<img src="../res/images/icon_user.png" class="left_img" >
				<input class="weui-input" placeholder="请输入手机号码" class="weui_input" required id="txt_phone" type="tel" maxlength="11"  oninput="check()">
			</div>
			<div class="weui-cell__bd  flex-row">
				<img src="../res/images/img_verification_code.png" class="left_img" >
				&nbsp;
				<input class="weui-input" placeholder="请输入验证码" class="weui_input" style="width: 40%;" required id="phone_code">
				<button class="weui-btn weui-btn_primary get-code" onclick="get_captcha()" id="v_container">获取验证码</button>
				<!-- <div id="code">
					<button class="cd" onclick="dogetCode()" >获取验证码</button>
					<img class="cd_pic disappear" id="codeImg" onclick="dogetCodeAgain()" src=""/>
				</div> -->
				<!-- <button  class=" cd" onclick="dogetSend()" >发送验证码</button> -->
			</div>
			<div class="weui-cell__bd">
				<img src="../res/images/icon_password.png" class="left_img" >
				<input class="weui-input" placeholder="请输入6~20个字符的密码" class="weui_input" required id="txt_paw" type="password">
				<img src="" alt="" class="togglePsw" data-index="0">
			</div>
			<div class="weui-cell__bd">
				<img src="../res/images/icon_password.png" class="left_img" >
				<input class="weui-input" placeholder="请再次输入密码" class="weui_input" required id="txt_paw2" type="password">
				<img src="" alt="" class="togglePsw" data-index="1">
			</div>
			<a href="javascript:;" class="weui-btn weui-btn_primary" style="color: #fff; margin-top: 100px;" onclick="newDoChangePaw()">修改密码</a>
			
		</div>

	<script>
		var code,token;
		var countdown = 60;

		var userNotFound = false	// 账号不存在

		// 获取验证码
		function dogetCode(){
			var params = { };
			$(".cd").addClass("disappear")
			$(".cd_pic").removeClass("disappear")
			newAjaxPost("/h5/captcha/captcha", params, dogetCodeOk);
		}
		function dogetCodeAgain(){
			var params = { };
			newAjaxPost("/h5/captcha/captcha", params, dogetCodeOk);
		}
		function dogetCodeOk(jsonInfo){
			console.log(jsonInfo)
			if(jsonInfo.code==1){
				var element = document.getElementById('codeImg');
				element.src = "data:image/png;base64," + jsonInfo.data.img;
				token = jsonInfo.data.cToken;
				code = jsonInfo.data.captcha;
			}else{
				msgInfo("获取失败");
			}
		}

		function check() {
			var strUserName = $("#txt_phone").val().trim();
			var myreg = /^1[3-9]\d{9}$/;
			if (strUserName.length == 11 && myreg.test(strUserName)) {
				let params = {
					"mobile": strUserName,
				}
				newAjaxPost("/h5/login/judgeUser", params, checkOk);
			}
		}

		function checkOk(jsonInfo) {
			if (jsonInfo.code == 1) {
				if (jsonInfo.data.list.length == 1 || (jsonInfo.data.list.length == 2 && jsonInfo.data.list[1] == 3)) {
					//单个角色
					roles = 1;
					userNotFound = false;
				} else if (jsonInfo.data.list.length >= 2) {
					// 用户和服务点都有
					roles = 2;
					userNotFound = false;
				} else {
					msgInfo("该账号尚未注册");
					userNotFound = true;
				}
			} else {
				msgInfo(jsonInfo.msg);
			}
		}

		// 修改密码
		function newDoChangePaw() {
			var strUserName, strPhoneCode, strPassWord, strRePassWord;
			var myreg=/^1[3-9]\d{9}$/;
			strUserName = $("#txt_phone").val().trim();
			strPhoneCode = $("#phone_code").val().trim();
			strPassWord = $("#txt_paw").val().trim();
			strRePassWord = $("#txt_paw2").val().trim();
			if (userNotFound) {
				msgInfo('该账号尚未注册')
				return false
			}
			if (isSpace(strUserName)) {
				msgInfo("手机号码不能为空！");
				return false;
			}
			if (!myreg.test(strUserName)) {
				msgInfo("请输入正确的手机号码！");
				return false;
			}
			if (isSpace(strPhoneCode)) {
				msgInfo("验证码不能为空！");
				return false;
			}
			if (isSpace(strPassWord)) {
				msgInfo("登录密码不能为空！");
				return false;
			}
			if (isSpace(strRePassWord)) {
				msgInfo("确认密码不能为空！");
				return false;
			}
			if(strPassWord.length < 6 || strPassWord.length > 20){
				msgInfo('请输入6-20位密码', 1200)
				return
			}
			if (strPassWord != strRePassWord) {
				msgInfo("两次输入的密码不一致，请重新输入");
				return false;
			}
			// if (code != strPhoneCode) {
			// 	msgInfo("手机验证码不一样！");
			// 	return false;
			// }
			var params = {
				"phoneCaptcha": strPhoneCode,
				// "chartToken": token,
				"confirmPassword": strRePassWord,
				"mobile": strUserName,
				"password": strPassWord,
				userType: 'P'
			};
			newAjaxPost("/h5/login/retrievePassword", params, newDoChangePawOk);
			return false;
		}
		function newDoChangePawOk(jsonInfo) {
			if (jsonInfo.code == 1){
				msgInfo("修改成功！");
				goPage("login.htm")
			}else
				msgInfo(jsonInfo.msg);
		}


		// 获取短信验证码
		function get_captcha() {
			var strUserName = $("#txt_phone").val().trim();
			var myreg = /^1[3-9]\d{9}$/;
			if (!myreg.test(strUserName)) {
				msgInfo("请输入正确的手机号码！");
				return false;
			} else if(userNotFound) {
				msgInfo("该账号尚未注册");
				return false;
			} else {
				let params = {
					"mobile": strUserName,
					"type": 1
				}
				newAjaxPost("/h5/captcha/phoneCaptcha", params, get_captchaOk);
				return true;
			}
		}

		function get_captchaOk(jsonInfo) {
			if (jsonInfo.code == 1) {
				noClick()
				msgInfo("已发送短信验证码,请注意查收！");
			} else {
				msgInfo(jsonInfo.msg);
			}
		}
		
		function noClick() {
			if (countdown == 0) {
				$('#v_container').text('重新发送')
				$('#v_container').removeClass("notClickn")
				countdown = 60;
			} else {
				$('#v_container').text('重新发送(' + countdown + ')')
				$('#v_container').addClass("notClickn")
				countdown--;
				setTimeout(noClick, 1000)
			}
		}

		// 显示密码==================
		const hidePsw = ''
		const showPsw = '../res/images/1.9.1img/eye_icon.png'
		let showingPsw = [false, false]

		$(".togglePsw").prop('src', hidePsw).show().on('click', function(){
			let i = $(this).attr('data-index')
			console.log(i);
			showingPsw[i] = !showingPsw[i]

			showingPsw[i] ? $(this).prop('src', showPsw).addClass('eye-open').prev().prop('type', 'text')
				: $(this).prop('src', hidePsw).removeClass('eye-open').prev().prop('type', 'password')
		})
	</script>
</body>
</html>